<HTML>
<HEAD>
<TITLE>JavaScript Source Code 3000:  Forms:  Only One Field</TITLE>
<META HTTP-EQUIV="JavaScript Source Code 3000" CONTENT = "no-cache">
<META NAME="date" CONTENT="2000-09-09">
<META NAME="channel" CONTENT="Web Developer">
<META NAME="author" CONTENT="JavaScript Source Code 3000">
<META NAME="section" CONTENT="Forms">
<META NAME="description" CONTENT="The visitor must fill in either one of two fields, their name or email address.  If they click in either box the other box's value is erased.  Ensures that when the form is submitted only one field contains a value.  Also contains validation that makes sure both fields are not empty.">

<SCRIPT LANGUAGE="JavaScript">




<!-- Begin
function checkFields() {
name = document.submitform.name.value;
email = document.submitform.email.value;

if ((name == "") && (email == "") ) {
alert("Please enter your name or your email address.");
return false;
}
else return true;
}
//  End -->
</script>
</HEAD>

<BODY BGCOLOR=#ffffff vlink=#0000ff>

<BR>
<center>
<table width=600 cellpadding=0 cellspacing=10>
<tr>
<td width=468 align=center>

    
    
</td>
<td width=120 align=center>
    
</td>
</tr>
</table>
<BR>
<BR>
<basefont size=3>
<FONT SIZE="+2" FACE="Helvetica,Arial">
<A HREF="../index.htm" /" TARGET="_top"><FONT COLOR="#0000FF"><b>Home</b></font></A>
<img src="../img/arrow.gif" /img/arrow.gif" height=13 width=7 border=0 alt="}">
<A HREF="index.htm" /forms/" ><font color="#FF0000"><b>Forms</b></font></A>
<img src="../img/arrow.gif" /img/arrow.gif" height=13 width=7 border=0 alt="}">
<FONT COLOR="#006666"><b>Only One Field</b></font></font>
<BR>
<BR>
<table BORDER=0 WIDTH=486 CELLPADDING=3 CELLSPACING=0>
<tr><td><font FACE="helvetica,arial,geneva">
<br>
<br>
<!-- Description --><!--content_start-->
The visitor must fill in either one of two fields, their name or email address.  If they click in either box the other box's value is erased.  Ensures that when the form is submitted only one field contains a value.  Also contains validation that makes sure both fields are not empty.
<hr>
</td></tr>
</table>
<!-- Demonstration -->
<center>
<form action="http://www.your-web-site-address-here.com/script.cgi" name=submitform onSubmit="return checkFields()">

Please enter your name or your email address.<br><br>
<table border=0>
<tr>
<td align=center>Name</td>
<td>&nbsp;</td>
<td align=center>Email</td>
</tr>
<tr>
<td align=center><input type=text name=name value="" onFocus="document.submitform.email.value='';" size=10></td>
<td align=center>Or...</td>
<td align=center><input type=text name=email value="" onFocus="document.submitform.name.value='';" size=10></td>
</tr>
<tr>
<td colspan=3 align=center><input type=submit value="Submit!"></td>
</tr>
</table>
</form>
</center>
<P>
<P>
<a name="source">
<table BORDER=0 WIDTH=486 CELLPADDING=3 CELLSPACING=0>
<tr><td BGCOLOR=yellow><font FACE="helvetica,arial,geneva"><b>JavaScript Source Code 3000:  Forms:  Only One Field</b>
<p>Simply click inside the window below, use your cursor to highlight the script, and copy (type Control-c or Apple-c) the script into a new file in your text editor (such as Note Pad or Simple Text) and save (Control-s or Apple-s).  The script is yours!!!
<br><br></font></td></tr>
<tr><td BGCOLOR=yellow ALIGN=CENTER>
<form NAME="copy">

<DIV align="center">
<input type=button value="Highlight All" onClick="javascript:this.form.txt.focus();this.form.txt.select();">&nbsp;&nbsp;&nbsp;&nbsp;
<INPUT TYPE="text" NAME="total" VALUE="Script Size:  1.45 KB" size=24>
</DIV>

<textarea NAME="txt" ROWS=20 COLS=75 WRAP=VIRTUAL>

&lt;!-- TWO STEPS TO INSTALL ONLY ONE FIELD:

  1.  Copy the coding into the HEAD of your HTML document
  2.  Add the last code into the BODY of your HTML document  --&gt;

&lt;!-- STEP ONE: Paste this code into the HEAD of your HTML document  --&gt;

&lt;HEAD&gt;

&lt;SCRIPT LANGUAGE="JavaScript"&gt;

&lt;! &gt;
&lt;! &gt;

&lt;!-- Begin
function checkFields() {
name = document.submitform.name.value;
email = document.submitform.email.value;

if ((name == "") && (email == "") ) {
alert("Please enter your name or your email address.");
return false;
}
else return true;
}
//  End --&gt;
&lt;/script&gt;
&lt;/HEAD&gt;

&lt;!-- STEP TWO: Copy this code into the BODY of your HTML document  --&gt;

&lt;BODY&gt;

&lt;center&gt;
&lt;form action="http://www.your-web-site-address-here.com/script.cgi" name=submitform onSubmit="return checkFields()"&gt;

Please enter your name or your email address.&lt;br&gt;&lt;br&gt;
&lt;table border=0&gt;
&lt;tr&gt;
&lt;td align=center&gt;Name&lt;/td&gt;
&lt;td&gt;&nbsp;&lt;/td&gt;
&lt;td align=center&gt;Email&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td align=center&gt;&lt;input type=text name=name value="" onFocus="document.submitform.email.value='';" size=10&gt;&lt;/td&gt;
&lt;td align=center&gt;Or...&lt;/td&gt;
&lt;td align=center&gt;&lt;input type=text name=email value="" onFocus="document.submitform.name.value='';" size=10&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td colspan=3 align=center&gt;&lt;input type=submit value="Submit!"&gt;&lt;/td&gt;
&lt;/tr&gt;
&lt;/table&gt;
&lt;/form&gt;
&lt;/center&gt;

 

&lt;!-- Script Size:  1.45 KB --&gt;</textarea><br><font FACE="helvetica,arial,geneva"></font></td></tr>

</table>
</form>
</FONT>
</CENTER>


</center>
</body></html>